<!DOCTYPE html>
<html>

	<head lang="en">
		<title>搜索页面</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<link rel="stylesheet" href="/js/plugins/bootstrap-4.1.1-dist/css/bootstrap.min.css">
		<script src="/js/plugins/jquery/jquery.min.js"></script>
		<script src="/js/plugins/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
		<link rel="stylesheet" href="/css/reset.css" />
		<link rel="stylesheet" href="/css/travel.css"/>
		<link rel="stylesheet" href="/css/strategy.css" />
		<script src="/js/plugins/jrender/jrender.min.js"></script>
		<link rel="stylesheet" href="/js/plugins/dialog2/dialog.css">
		<script src="/js/plugins/dialog2/dialog.min.js"></script>
		<script type="text/javascript" src="/js/plugins/form/jquery.form.js"></script>
		<script src="/js/common.js"></script>

	</head>
<script>
	$(function () {
        //获取装载攻略数据的input框
        var currentInput = $("#currentPage");
        //获取装载游记数据的input框
        var currentInput2 = $("#currentPage2");
        //获取装载日报数据的input框
        var currentInput3 = $("#currentPage3");

        //创建用于存储游记的数组
        var travelArr = [];
        //创建用于存储攻略的数组
        var strategyArr = [];
        //创建用于存储日报的数组
        var dailyArr = [];

        //攻略总页数
        var pages = 1;
        //游记总页数
        var pages2 = 1;
        //日报总页数
        var pages3 = 1;
		//用于判断执行哪个方法
        var judge=1;

		//-----------------------------------------------------

        var params = getParams();
        params = decodeURI(params.text);


        //将传递过来的参数赋值给input框
            $("#editForm input[name='text']").val(params);
            $("#strategyForm input[name='text']").val(params);
            $("#dailyForm input[name='text']").val(params);


		//攻略
        function query(){
            var currentPage = currentInput.val();
            $("#strategyForm input[name='currentPage']").val(currentPage);

            $("#strategyForm").ajaxSubmit(function (data) {
                //合并两个数组到第一个参数数组上
                $.merge(strategyArr, data.result.list);
                //用于渲染时循环,循环时是取list的属性出来

                var json = {
                    list: strategyArr
                };
                if(data.success && data.result.list.length != 0){
                    $("#travelall").renderValues(json, {
                        getHref: function (item, value) {
                            //item是当前要渲染数据的元素(a),value就是render-key获取的值
                            //获取要跳转的地址
                            var href = $(item).data("href");
                            //把id拼接进去,再设置到a连接的href属性上
                            $(item).attr('href', href + value);
                        }
                    });
                }else {
                    $("#pills-1").html("无相关攻略")
                }
                //设置总页数
                pages = data.result.pages
            });
            //当前页input框+1
            currentInput.val(parseInt(currentPage) + 1);
		}

		//游记
		function travel(){
            var currentPage = currentInput2.val();
            $("#editForm input[name='currentPage']").val(currentPage);
            //游记
            $("#editForm").ajaxSubmit(function (data) {
                //合并两个数组到第一个参数数组上
                $.merge(travelArr, data.result.list);
                //用于渲染时循环,循环时是取list的属性出来
                var json = {
                    list: travelArr
                };
                if(data.success ){
                    if (json.list.length != 0) {
                        $("#travelsheadline").html("相关游记")
                    }else{
                        $("#travelsheadline").html("无相关游记")
                    }
                    $("#allTravels").renderValues(json, {
                        getHref: function (item, value) {
                            //item是当前要渲染数据的元素(a),value就是render-key获取的值
                            //获取要跳转的地址
                            var href = $(item).data("href");
                            //把id拼接进去,再设置到a连接的href属性上
                            $(item).attr('href', href + value);
                        }
                    });
                }else {
                    $("#pills-2").html("无相关游记")
                }
                //设置总页数
                pages2 = data.result.pages
            });
            //当前页input框+1
            currentInput2.val(parseInt(currentPage) + 1);
        }

        //日志
		function daily(){
            var currentPage = currentInput3.val();
            $("#dailyForm input[name='currentPage']").val(currentPage);
            $("#dailyForm").ajaxSubmit(function (data) {
                //合并两个数组到第一个参数数组上
                $.merge(dailyArr, data.result.list);
                //用于渲染时循环,循环时是取list的属性出来
                var json = {
                    list: dailyArr
                };
                if(data.success ){
                    if (json.list.length != 0) {
                        $("#headline").html("相关日报")
                    }else{
                        $("#headline").html("无相关日报")
                    }
                    $("#alldaily").renderValues(json, {
                        getHref: function (item, value) {
                            //item是当前要渲染数据的元素(a),value就是render-key获取的值
                            //获取要跳转的地址
                            var href = $(item).data("href");
                            //把id拼接进去,再设置到a连接的href属性上
                            $(item).attr('href', href + value);
                        }
                    });
                }
                //设置总页数
                pages3 = data.result.pages
            });
            //当前页input框+1
            currentInput3.val(parseInt(currentPage) + 1);
        }

        //默认查询第一页的数据
        query();
        travel();
        daily();

        //当页面滚动条变化时，执行的函数
        $(window).scroll(function () {
            if ($(document).scrollTop() + $(window).height() >= $(document).height() -1 ){
                var currentPage = currentInput.val();
                //判断是否小于或等于最后一页,如果是就去查询
                if (currentPage <= pages) {
                    query();
                }else {
                    $(document).dialog({
                        type: 'notice',
                        infoText: '已经到底了!',
                        autoClose: 500,
                        position: 'bottom'  // center: 居中; bottom: 底部
                    });
                }
			}

        });

        $("#pills-2-tab").click(function () {
            judge = 2;
            travel();
            travelpaging();
        })

        $("#pills-3-tab").click(function () {
            judge = 3;
            daily();
            dailypaging();
        })

		function travelpaging() {
            $(window).scroll(function () {
                if ($(document).scrollTop() + $(window).height() >= $(document).height()) {
                    var currentPage2 = currentInput2.val();
                    if (judge == 2) {
                        if (currentPage2 <= pages2) {
                            travel();
                        } else {
                            $(document).dialog({
                                type: 'notice',
                                infoText: '已经到底了!',
                                autoClose: 500,
                                position: 'bottom'  // center: 居中; bottom: 底部
                            });
                            judge = 1;
                        }
                    }
                }
            })
        }

        function dailypaging() {
            $(window).scroll(function () {
                if ($(document).scrollTop() + $(window).height() >= $(document).height() - 32) {
                    var currentPage3 = currentInput3.val();
                    if (judge == 3) {
                        if (currentPage3 <= pages3) {
                            daily();
                        } else {
                            $(document).dialog({
                                type: 'notice',
                                infoText: '已经到底了!',
                                autoClose: 500,
                                position: 'bottom'  // center: 居中; bottom: 底部
                            });
                            judge = 1;
                        }
                    }
                }
            })
        }
    })
</script>
	<body>
	<div class="search-head">
		<div class="row nav-search">
			<div class="col-2">
				<a href="index.html">
					<span><i class="fa fa-chevron-left fa-2x"></i></span>
				</a>
			</div>

		</div>
	</div>



	<ul class="nav nav-pills nav-justified border border-left-0 border-top-0 border-right-0" id="pills-tab" role="tablist">
		<li class="nav-item">
			<a class="nav-link active show" id="pills-1-tab" data-toggle="pill" href="#pills-1">
				<span style="font-weight: bold;">攻略</span>
			</a>
		</li>
		<li class="nav-item" ><a data-id="2" class="nav-link" id="pills-2-tab" data-toggle="pill" href="#pills-2">游记</a>
		</li>
		<li class="nav-item"><a data-id="3" class="nav-link" id="pills-3-tab" data-toggle="pill" href="#pills-3">日报</a>
		</li>
    </ul>
	<div class="tab-content" id="pills-tabContent">
		<div class="tab-pane fade active show" id="pills-1">
			<div class="container strategyDetails">
				<h6>相关攻略</h6>
				<form id="strategyForm" method="post" action="/seekall/selectstrategybyid">
					<input type="hidden" name="text" id="strategy">
					<input type="hidden" name="currentPage">
				</form>
				<div id="travelall">
					<div render-loop="list">
						<div class="row detail">
							<div class="col">
								<a data-href="strategyDetails.html?id=" render-key="list.id" render-fun="getHref">
									<h4 render-html="list.title"></h4>
								</a>
							</div>
							<div class="col bigimg">
								<a data-href="strategyDetails.html?id=" render-key="list.id" render-fun="getHref" >
									<img render-src="list.coverUrl">
								</a>
							</div>
						</div>
					</div>
				</div>
			</div>
			<input type="hidden" name="currentPage" id="currentPage" value="1">
		</div>

		<div class="tab-pane fade" id="pills-2">
			<div class="container">
			<h6 id="travelsheadline">相关游记</h6>
				<form id="editForm" method="post" action="/seekall/selecttravelbyid">
					<input type="hidden" name="text" id="judge">
					<input type="hidden" name="currentPage">
				</form>
				<div id="allTravels">
				<div render-loop="list">
					<div class="row detail">
						<div class="col">
							<a data-href="travelContent.html?id=" render-key="list.id" render-fun="getHref">
								<h4 render-html="list.title"></h4>
							</a>
							<p>
								<a href="userProfiles.html">
									<img class="rounded-circle head-img" render-src="list.author.headImgUrl">
									<span render-html="list.author.nickName"></span>
								</a> 在
								<span class="addr" render-html="list.place.name"></span>

							</p>

						</div>
						<div class="col bigimg">
							<a data-href="travelContent.html?id=" render-key="list.id" render-fun="getHref">
								<img render-src="list.coverUrl">
							</a>
						</div>
					</div>
				</div>
					<input type="hidden" name="currentPage2" id="currentPage2" value="1">
				</div>
		</div>
	</div>



		<div class="tab-pane fade" id="pills-3">
            <div class="container">
			<h6 id="headline">相关日报</h6>
			<form id="dailyForm" method="post" action="/seekall/selectdailybyid">
				<input type="hidden" name="text" id="daily">
				<input type="hidden" name="currentPage">
			</form>
			<div id="alldaily">
				<div render-loop="list">
					<div class="row detail">
						<div class="col">
							<a data-href="newsContent.html?id=" render-key="list.id" render-fun="getHref">
								<h4 render-html="list.title"></h4>
							</a>
							<p>
							<span> </span>
							&lt;!&ndash;<i class="fa fa-heart-o"></i>&ndash;&gt;
							</p>
						</div>
						<div class="col bigimg">
							<a data-href="newsContent.html?id=" render-key="list.id" render-fun="getHref">
								<img render-src="list.coverUrl" width="100%">
							</a>
						</div>
					</div>
				</div>
			</div>
            </div>
			<input type="hidden" name="currentPage3" id="currentPage3" value="1">
		</div>
	</div>
	</body>

</html>